<template>
  <div id="scroll-board">
    <el-button type="primary" icon="el-icon-search" size="mini" @click="handleSetLineChartData" style="margin-left: 20px;">搜索</el-button>
    <dv-scroll-board :config="config" />
  </div>
</template>

<script>
import {listExperimentDatasView} from "@/api/ruoyiyinzheng/experimentDatasView";

export default {
  name: 'ScrollBoard',
  data() {
    return {
      data: [],
      experimentDatasViewList: [],
      total: 0,
      // 查询参数
      // queryParams: {
      //   pageNum: 1,
      //   pageSize: 10,
      //   experimentNumber: undefined,
      //   clorlNumber: undefined,
      //   colorSchemeName: undefined,
      //   stRecieptName: undefined,
      //   acceptable: undefined
      // },
      config: {
        header: ['实验编号', '色系', '色号', '配方'],
        data: [],
        index: true,
        columnWidth: [50, 170, 300],
        align: ['center'],
        rowNum: 7,
        headerBGC: '#1981f6',
        headerHeight: 45,
        oddRowBGC: 'rgba(0, 44, 81, 0.8)',
        evenRowBGC: 'rgba(10, 29, 50, 0.8)'
      }
    }
  },
  methods: {
    handleSetLineChartData() {
      listExperimentDatasView(this.queryParams).then(response => {
        this.experimentDatasViewList = response.rows;
        this.total = response.total;
        let temp = []
        for (let i = 0; i < this.experimentDatasViewList.length; i++) {
          let 实验编号 = this.experimentDatasViewList[i].experimentNumber;
          let 色系 = this.experimentDatasViewList[i].colorSchemeName;
          let 色号 = this.experimentDatasViewList[i].clorlNumber;
          let 配方 = this.experimentDatasViewList[i].stRecieptName;
          temp.push([实验编号, 色系, 色号, 配方]);
        }
        this.config.data = temp;
        this.config = {...this.config}
      });
    }
  }
}

</script>

<style lang="less">
#scroll-board {
  width: 50%;
  box-sizing: border-box;
  margin-left: 20px;
  height: 100%;
  overflow: hidden;
}
</style>
